
import { createSvg, svgns, xlinkns } from './svg.js'
import { renderShape } from './renderShape.js'
import { _append } from '../ui/dom.js'
import { _screen } from '../store/index.js'
import { translateY } from '../math/index.js'
import { _layout } from '../common/layout.js'
import { isObject } from '../utils/index.js'
import {_show} from '../common/index.js'

// svg包围
export const _svg = (options) => {
  let {
    name,
    width,
    height,
    shapes = [],
    pattern = [],
    props,
    axis,
    // grid,
    // polar,
    layout,
    o
  } = options


  let screen = _screen(width, height)
  height = screen.height
  width = screen.width
  if (!o) {
    o = screen.o
  }

  let svg = createSvg('svg', {
    width,
    height,
    xmlns: svgns,
    'xmlns:xlink': xlinkns,
    viewBox: `0,0,${width},${height}`,
    // preserveAspectRatio: "XMidYMid meet"
  })

  const fn = (t) => {
    if (!t) return
    let { shape } = t
    if (shape === 'lsystemPlant' && (layout == null || layout === '0')) {
      // 植物lsystem的原点下移
      o = translateY(o, height / 2 - 100)
    }
    let svgDom = renderShape({
      o,
      ...t,
      name,
      width,
      height
    }, {
      ...props,
      ...t.props
    })
    _append(svg, svgDom)
  }

  // const axisMap = {
  //   axis, grid, polar
  // }
  // Object.keys(axisMap).forEach(t => {

  //   axisMap[t] && fn({
  //     shape: t,
  //     ...axisMap[t]
  //   })
  // })
  if (_show(axis)) {
    let type
    if (isObject(axis)) {
      type = axis.type
    } else {
      type = axis
    }
    if (type !== 'none') {
      fn({ shape: type, ...axis })
    }


  }


  pattern.forEach(t => fn(t))

  _layout({ layout, width, height, o }, shapes, fn)

  return svg
}
